<template>
  <a-row :gutter="16">
    <a-col :span="12">
      <a-statistic v-if="showRange == '0'" title="全校排名" :value="rankingData.schoolRanking + '/' + rankingData.schoolTotal" style="margin-right: 50px">
<!--        <template #suffix>-->
<!--          <a-icon v-if="schoolIcon == 1" type="like" style="color:#52c41a"/>-->
<!--          <a-icon v-if="schoolIcon == 2" type="smile" style="color:#1890ff"/>-->
<!--          <a-icon v-if="schoolIcon == 3" type="frown" style="color:#faad14"/>-->
<!--        </template>-->
      </a-statistic>
    </a-col>
    <a-col :span="12">
      <a-statistic title="部门排名" :value="rankingData.depRanking + '/' + rankingData.depTotal" class="margin-left: 50px">
<!--        <template #suffix>-->
<!--          <a-icon v-if="depIcon == 1" type="like" style="color:#52c41a"/>-->
<!--          <a-icon v-if="depIcon == 2" type="smile" style="color:#1890ff"/>-->
<!--          <a-icon v-if="depIcon == 3" type="frown" style="color:#faad14"/>-->
<!--        </template>-->
      </a-statistic>
    </a-col>
  </a-row>
</template>

<script>


export default {
  name: "projectsClassificationResultRankingV1",
  props: {
    showRange:{
      type:String,
      required:false,
      default() {
        return '0'
      }
    },
    rankingData:{
      type:Object,
      default(){
        return {
          schoolRanking:0,
          depRanking:0,
          schoolTotal:0,
          depTotal:0
        }
      },
      required:true
    }
  },
  data(){

    return {

    }

  },
  computed:{
    schoolIcon: function(){
      let temp = this.rankingData.schoolTotal/3;
      if(this.rankingData.schoolRanking < temp){
        return 1;
      } else if(this.rankingData.schoolRanking > temp*2){
        return 3;
      } else {
        return 2;
      }
    },
    depIcon: function(){
      let temp = this.rankingData.depTotal/3;
      if(this.rankingData.depRanking < temp){
        return 1;
      } else if(this.rankingData.depRanking > temp*2){
        return 3;
      } else {
        return 2;
      }
    }
  }

}
</script>

<style scoped>

</style>